<template>
    <div>
        <div>{{ num }}</div>
        <div>{{ name_child }}</div>
        <div>{{ num_sync }}</div>
        <button v-on:click="changeName">changeName</button><br>
        <button v-on:click="changeParent">changeParent</button><br>
        <button @click="changeTongXin">changeTongXin</button><br>
        <button @click="changeNumSync">changeNumSync</button><br>
        <button @click="changeN1(2)">changeN1</button><br>
    </div>
</template>
<script>
export default {
    props: ['num', 'name', 'num_sync'],
    // props: {
    //     num: {
    //         type: Number,
    //         default: 0,
    //         required: true,
    //         validator(value) {
    //             console.log(value);
    //             return true;
    //         }
    //     },
    //     name: {
    //         type: String,
    //         required: true
    //     }
    // },
    inject: ['age_provide', 'log1_provide', 'changeN1', 'obj'],
    data() {
        return {
            name_child: this.name
        }
    },
    mounted() {
        console.log('children',this.$attrs);
        // this.age_provide++;
        console.log(this.age_provide);
        this.log1_provide()
        setTimeout(() => {
            this.obj.a = 3
        }, 1000)
    },
    methods: {
        changeName() {
            // console.log(this.prop);
            this.name_child = this.name_child + 'haha';
            this.name = this.name + 'haha';
        },
        changeParent() {
            this.$emit('change', 3, 'parent');
        },
        changeTongXin() {
            this.$bus.$emit('change$bus', 'lisi');
        },
        changeNumSync() {
            this.$emit('update:num_sync', 10000);
        }
    }
}
</script>
<style></style>